<template>
  <el-container style="margin-left: 0px;">
    <el-header>
      <el-row>
        <el-col :span="12" style="font-size: 20pt;">WMS仓库管理系统</el-col>
        <el-col :span="12" style="text-align: right;">
          <el-button @click="quit">退出系统</el-button>
        </el-col>
      </el-row>
    </el-header>
    <el-container>
      <el-aside width="180px" style="background-color: rgb(61, 59, 57);">
        <el-aside width="180px"><el-menu active-text-color="#ffd04b" background-color="#545c64"
            class="el-menu-vertical-demo" default-active="2" text-color="#fff" router>
            <el-sub-menu index="1">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>工作台</span>
              </template>
            </el-sub-menu>
            <el-sub-menu index="2">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>基础数据</span>
              </template>
              <el-menu-item index="/BasicInformation/BasicView">
                <el-icon><icon-menu /></el-icon>
                <span>基础数据-承运商档案</span>
              </el-menu-item>
              <el-menu-item index="/BasicInformation/VendorView">
                <el-icon><icon-menu /></el-icon>
                <span>基础数据-供应商档案</span>
              </el-menu-item>
              <el-menu-item index="/BasicInformation/WarehouseLocationView">
                <el-icon><icon-menu /></el-icon>
                <span>基础数据-仓库库位</span>
              </el-menu-item>
            </el-sub-menu>
            <el-sub-menu index="3">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>库存管理</span>
              </template>
              <el-menu-item index="/TotalInventory/TotalView">
                <el-icon><icon-menu /></el-icon>
                <span>库存管理-库存总量</span>
              </el-menu-item>
              <el-menu-item index="/GoodsInfoView/GoodsInfoQuery">
                <el-icon><icon-menu /></el-icon>
                <span>库存管理-商品</span>
              </el-menu-item>
              <el-menu-item index="/GoodsInfoView/StorageView">
                <el-icon><icon-menu /></el-icon>
                <span>库存管理-入库</span>
              </el-menu-item>
              <el-menu-item index="/GoodsInfoView/OutBundView">
                <el-icon><icon-menu /></el-icon>
                <span>库存管理-出库</span>
              </el-menu-item>
              <el-menu-item index="/BasicInformation/Large_screen_displayView">
                <el-icon><icon-menu /></el-icon>
                <span>大屏显示</span>
              </el-menu-item>
            </el-sub-menu>
            <el-sub-menu index="4">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>系统设置</span>
              </template>
              <el-menu-item index="/RBAC/UserView">
                <el-icon><icon-menu /></el-icon>
                <span>员工管理</span>
              </el-menu-item>
              <el-menu-item index="/RBAC/RoleUserView">
                <el-icon><icon-menu /></el-icon>
                <span>角色管理</span>
              </el-menu-item>
            </el-sub-menu>

            <el-sub-menu index="5">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>报表管理</span>
              </template>
              <el-menu-item index="/ReportView/InventoryList">
                <el-icon><icon-menu /></el-icon>
                <span>库存清单</span>
              </el-menu-item>

              <el-menu-item index="/ReportView/InventoryCapacity">
                <el-icon><icon-menu /></el-icon>
                <span>库存容量</span>
              </el-menu-item>

              <el-menu-item index="/BasicInformation/StockAvailable">
                <el-icon><icon-menu /></el-icon>
                <span>可出库存</span>
              </el-menu-item>

            </el-sub-menu>

            <el-sub-menu index="6">
              <template #title>
                <el-icon>
                  <location />
                </el-icon>
                <span>工作流管理</span>
              </template>
              <el-menu-item index="/WorkflowEngine/SettingsEngineView">
                <el-icon><icon-menu /></el-icon>
                <span>工作流引擎</span>
              </el-menu-item>
              <el-menu-item index="/logicflow/logicflowBpmn">
                <el-icon><icon-menu /></el-icon>
                <span>logicflowBpmn</span>
              </el-menu-item>
              <el-menu-item index="/logicflow/logicflowCustom">
                <el-icon><icon-menu /></el-icon>
                <span>logicflowCustom</span>
              </el-menu-item>
            </el-sub-menu>
          </el-menu></el-aside>
      </el-aside>
      <el-main><router-view></router-view></el-main>
    </el-container>
  </el-container>
</template>

<script setup lang='ts'>
//引入组件
import { ElMessage, ElMessageBox } from 'element-plus'
import { useRouter, useRoute } from 'vue-router';
import { Document, Menu as IconMenu, Location, Setting, UserFilled } from '@element-plus/icons-vue'
import { ref, onMounted } from 'vue'

const router = useRouter();

import axios from 'axios'

const seLogin = () => {
  router.push({ name: "LoginView" })
}
//方法
function quit() {
  ElMessageBox.confirm(
    '确认退出吗?',
    '系统提示',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'error',
    }
  )
    .then(() => {
      router.push('/')
    })
}

const data = ref([])
function showData() {
  axios.get('http://localhost:5115//api/User/QueryUserById/QueryUserByIdAsync?user_Id=')
}

onMounted(() => {

})
</script>

<style>
/* 在全局样式文件中设置背景图片 */
body {
  background-image: url('../components/Photo/775a38f0314fa255cff9f1e4d6ad9dd7.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* 顶部样式 */
.el-header {
  background-color: rgb(15, 20, 17);
  color: white;
  height: 80px;
  line-height: 80px;
}

/* 左侧样式 */
.el-aside {

  min-height: calc(100vh - 80px);
}
</style>